<%@ page import="dao.NoteDao" %>
<%@ page import="dao.impl.NoteDaoImpl" %>
<%@ page import="service.FavouriteService" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="service.impl.FavouriteServiceImpl" %>
<%@ page import="service.impl.LikesServiceImpl" %>
<%@ page import="service.LikesService" %>
<%@ page import="service.NoteLabelsService" %>
<%@ page import="service.impl.NoteLabelsServiceImpl" %>
<%@ page import="pojo.*" %><%--
  Created by IntelliJ IDEA.
  User: tangms
  Date: 2022/4/21
  Time: 11:19
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<script src="script/jquery-3.3.1.js"></script>
<html>
<head>
    <title>Title</title>
    <script type="text/javascript">
        // $(function (){
        //     $("#warning").html("内容不得为空！")
        //     $("#warning").css("color","red");
        //     $("#warning").fadeOut(10);
        // })

        // function comments(nid){
        //     var url="noteServlet?action=comments";
        //     var msg={"nid":nid};
        //     $.getJSON(url,msg,function (data){
        //         var lis='<form> <table> <tr>';
        //         var usename=$("#userLoginUsename").val();
        //         for(var i=0;i<data.length;i++){
        //             if(data[i].usename==usename){
        //                 var li='<h5 class="title_left">'+data[i].usename+'<a href="javascript:userDeleteComment('+data[i].cid+');" id="delete">删除</a></h5><p class="comment">'+data[i].comment+'</p>';
        //                 lis+=li+'</tr></table></form>';
        //             }else{
        //                 var li='<h5 class="title_left">'+data[i].usename+'</h5><p class="comment">'+data[i].comment+'</p>';
        //                 lis+=li+'</tr></table></form>';
        //             }
        //         }
        //         $("#comments").html(lis);
        //         $("#comments").fadeIn("slow");
        //         $("#fold").attr("href","javascript:fold();")
        //     });
        // }
        function comments(nid){
            var url="${pageContext.request.contextPath}/noteServlet?action=comments";
            var msg={"nid":nid};
            $.getJSON(url,msg,function (data){
                var lis='<form> <table> <tr>';
                var usename=$("#userLoginUsename").val();
                for(var i=0;i<data.length;i++){
                    if(data[i].usename==usename){
                        var li='<h5 class="title_left">'+data[i].usename+'<a href="javascript:userDeleteComment('+data[i].cid+');" id="delete">删除</a></h5><p class="comment">'+data[i].comment+'</p>';
                        lis+=li+'</tr></table><h4><a class="fold" id="reply" href="javascript:reply('+data[i].cid+');">查看回复</a><ul id="'+data[i].cid+'"></ul></h4></form>';
                    }else{
                        var li='<h5 class="title_left">'+data[i].usename+'</h5><p class="comment">'+data[i].comment+'</p>';
                        lis+=li+'</tr></table><h4><a class="fold" id="reply" href="javascript:reply('+data[i].cid+');">查看回复</a></h4></form>';
                    }

                }
                $("#comments").html(lis);
                $("#comments").fadeIn("slow");
                $("#fold").attr("href","javascript:fold();")
            });
        }




        function fold(){
            $("#comments").fadeOut("slow");
            $("#fold").removeAttr("href");
        }

        function userDeleteComment (cid){
            //alert(cid)
            if(confirm("您确定删除吗？")){
                location.href="${pageContext.request.contextPath}/noteServlet?action=userDeleteComment&cid="+cid;
            }
        }
        function addComment(nid,uid){
            var comment=$(".comment").val();
            if(comment==null||comment==""){
                alert("内容为空！");
                // $(".comment").val("");
                // $("#warning").fadeIn();
                // $("#warning").fadeOut(2000);
            }else{
                location.href="${pageContext.request.contextPath}/noteServlet?action=addComment&nid="+nid+"&uid="+uid+"&comment="+comment;
            }
        }

        function reply(cid){
            var url="noteServlet?action=commentsChilden";
            var msg={"cid":cid};
            $.getJSON(url,msg,function (data){
                var lis='<form> <table> <tr>';
                var usename=$("#userLoginUsename").val();
                for(var i=0;i<data.length;i++){
                    if(data[i].usename==usename){
                        var li='<h5 class="childentitle_left">'+data[i].usename+'<a href="javascript:userDeleteComment('+data[i].cid+');" id="delete">删除</a></h5><p class="comment_left">'+data[i].comment+'</p>';
                        lis+=li+'</tr></table></form>';
                    }else{
                        var li='<h5 class="childentitle_left">'+data[i].usename+'</h5><p class="comment_left">'+data[i].comment+'</p>';
                        lis+=li+'</tr></table></form>';
                    }

                }


$("#"+cid).html(lis);
                $("#"+cid).fadeIn("slow");
                $("#childen").html(lis);
                $("#childen").fadeIn("slow");
                //$("#fold").attr("href","javascript:fold();")
            });

        }
    </script>

</head>
<style>
    *{
        margin: 0px;
        padding: 0px;
        box-sizing: border-box;
    }
    #commentAdd,#userComment{
        margin-left: 320px;
    }
    .bag{
        /*width: 500px;*/
        /*height:110px;*/
        /*border: 8px solid #EEEEEE;*/
        margin: auto;
        padding: 15px;
    }
    .choice{
        border: 1px solid lightskyblue;
        margin: auto;
    }
    .button{
        border: 1px solid dodgerblue;
        background-color: dodgerblue;
        align-content: center;
    }
    #firstPage{
        float: left;
        margin: auto;
    }
    #view{
        float: right;
        margin: auto;
    }
    #game{
        margin-left: 15px;
        margin-right: 20px;
    }
    #food{
        margin-left: 15px;
        margin-right: 20px;
    }
    #cartoon{
        margin-left: 15px;
        margin-right: 10px;
    }
    .end{
        float: right;
        margin-top: 10px;
    }
    .title_left{
        margin-left: 420px;
    }
    .labelTitle,.commentTitle,.type{
        margin-left: 420px;
    }
    .comment,.content_left{
        border:1px solid black;
        width: 440px;
        margin-left: 420px;
        height: 100px;
        margin-bottom: 20px;
    }
    .comment_left{
        margin-left: 470px;
    }
    .childentitle_left{
        border:1px solid black;
        width: 440px;
        margin-left: 470px;
        height: 100px;
        margin-bottom: 20px;
    }
    .page{
        margin-left: 420px;
    }
    .active{
        border:1px solid lightskyblue;
        background-color:lightskyblue;
        width:12px;
        height:10px;
    }
    .nonactive{
        border:1px solid black;
        width:12px;
        height:10px;
    }
    .fold,#favouriteCount,#likesCount,#sent{
        margin-left: 790px;
    }
    .back{
        margin-left: 790px;
    }
    #delete{
        margin-left: 450px;
    }
    #hidden{
        margin-left: 400px;
    }
</style>

<body>
<%
    User userLogin= (User) session.getAttribute("userLogin");
    request.setAttribute("userLogin",userLogin);
    int nid= Integer.parseInt(request.getParameter("nid"));
    int uid= Integer.parseInt(request.getParameter("uid"));
    NoteDao noteDao=new NoteDaoImpl();
    Note note=noteDao.findNote(nid);
    request.setAttribute("note",note);
    FavouriteService favouriteService=new FavouriteServiceImpl();
    ArrayList<Favourite> favouriteList=new ArrayList<>();
    favouriteList=favouriteService.favourites(uid);
    request.setAttribute("favouriteList",favouriteList);
    boolean flag=false;
    request.setAttribute("flag",flag);
    LikesService likesService=new LikesServiceImpl();
    ArrayList<Likes> likesList=likesService.likes(uid);
    request.setAttribute("likesList",likesList);
    boolean flag2=false;
    request.setAttribute("flag2",flag2);

//    note的标签集合
    NoteLabelsService noteLabelsService=new NoteLabelsServiceImpl();
    ArrayList<NoteLabels> noteAllLabelsList=new ArrayList<>();
    noteAllLabelsList=noteLabelsService.noteLabelsList(nid);
    ArrayList<Label> noteLabels=new ArrayList<>();
    noteLabels=noteLabelsService.noteLabels(noteAllLabelsList);
    request.setAttribute("noteLabels",noteLabels);
%>
<h2 align="center">${note.title}</h2>
<a href="${pageContext.request.contextPath}/pageServlet?action=allNotesPage"><h6 class="back">返回首页</h6></a>
<form>
    <table>
        <tr>
            <td>
                <h5 class="title_left">${note.usename}</h5>
                <h5 class="type">所属区域：${note.type}</h5>
                <c:forEach items="${favouriteList}" var="favourite" varStatus="s">
                <c:if test="${favourite.nid==note.nid}">
                <input type="hidden" value="${flag=true}">
                </c:if></c:forEach>
                <c:if test="${flag==false}">
                <span id="favouriteCount">${note.favourite}</span>
                <a href="${pageContext.request.contextPath}/noteServlet?action=favourite&nid=${note.nid}&uid=${userLogin.uid}" type="submit" class="favourite" >收藏</a>
                <a type="submit" class="favourite" >取消</a>
                </c:if>
                <c:if test="${flag==true}">
                <span id="favouriteCount">${note.favourite}</span>
                <a type="submit" class="favourite" >收藏</a>
                <a href="${pageContext.request.contextPath}/noteServlet?action=unFavourite&nid=${note.nid}&uid=${userLogin.uid}" type="submit" class="favourite" >取消</a>
                </c:if>
                <c:forEach items="${likesList}" var="likes" varStatus="s">
                <c:if test="${likes.nid==note.nid}">
                <input type="hidden" value="${flag2=true}">
                </c:if>
                </c:forEach>
                <c:if test="${flag2==false}">
                <span id="likesCount">${note.likes}</span>
                <a href="${pageContext.request.contextPath}/noteServlet?action=likes&nid=${note.nid}&uid=${userLogin.uid}" class="like" type="submit">点赞</a>
                <a class="unlike" type="submit">取消</a>
                </c:if>
                <c:if test="${flag2==true}">
                <span id="likesCount">${note.likes}</span>
                <a class="like" type="submit">点赞</a>
                <a href="${pageContext.request.contextPath}/noteServlet?action=unlikes&nid=${note.nid}&uid=${userLogin.uid}" class="unlike" type="submit">取消</a>
                </c:if>
<br>
                <h5 class="labelTitle">标签：</h5>
                <span class="labelTitle">
                                    <c:forEach items="${noteLabels}" var="labels" varStatus="s">
                                        <ui>${labels.label}</ui>
                                    </c:forEach>
                </span>
<br>
                <p class="content_left">${note.content}</p>
                <h5 class="commentTitle">添加评论：</h5>
                <ul id="addComment">
                    <a href="javascript:addComment('${note.nid}',${userLogin.uid});" id="sent">提交</a>
                    <input type="text" id="comment" class="comment">
                    <span id="warning"></span>
                </ul>
                <input type="hidden" value="${userLogin.usename}" id="userLoginUsename">
                <h3 align="center"><a class="comment-button" id="comment-button" href="javascript:comments(${note.nid});">评论</a></h3>
                <ul id="comments">
                </ul>
                <ul id="childen">
                </ul>
                <h4><a class="fold" id="fold">收起</a></h4>
        </tr>
    </table>
</form>
</body>
</html>
